<template>
	<div class="left">
		<!--左组件 可复用的组件-->
		<!--页面上显示组件-->
		<!--父子组件传参时，父组件给子组件传参，父组件侧用约定好的参数名作为属性名-->
		<!--子组件给父组件传参，父组件绑定约定好的事件-->
		<input type="text" v-model="inputMsg"/>
		<left :msg1="inputMsg" msg2="world" @postMsg="getMsg"></left>
	</div>
		<div class="right">
			<!--右组件-->
			右面部分
	</div>
</template>

<script>
//第一步 引入
import left from'../components/Left.vue'

export default{
	
	data() {
		return{
			inputMsg:''
		}
	},
	//第二步 定义成组件
	components:{
		left
	},
	methods:{
		getMsg:function(data1,data2){
			alert(data1+data2);
		}
	},
	provide(){
		return{
			num:5
		}
	}
}
</script>

<style>
</style>